<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <title>用户</title>
	<script type="text/javascript" src="js/jquery-3.5.1.min.js"></script>
	<script type="text/javascript" src="js/userJScript.js"></script>
	<!--<script type="text/javascript" src="js/main.js"></script>-->

    <link rel="stylesheet" href="layui/css/layui.css" />
	<link rel="stylesheet" href="http://at.alicdn.com/t/font_2150071_kgpn76p8fcg.css" />
	<link rel="stylesheet" href="./css/userStyle.css"/>
	<link rel="stylesheet" href="css/main.css" />
	<script>
		  const IMG_URL = 'http://localhost:8085/';
		  let userData;
		  $.ajax({
			  url:  '/user/getUserById/' + sessionStorage.getItem('userId'),
			  contentType: 'application/json',
			  success: function (res) {
			  	userData = res.data;
			  	$('.name').html(res.data.username);
				$('.avatar_img').attr('src',IMG_URL+res.data.avatarUrl);
			  }
		  })
		  function changes() {
			  $("#information").addClass("layui-btn-lg");
			  $("#garbNoti").attr("class","layui-btn");
			  $("#garbDire").attr("class","layui-btn");
			  $("#garbRecy").attr("class","layui-btn");
			  $("#garbHome").attr("class","layui-btn");
			  $("#contIfra").attr("src","userInfo.html");
		  }
		  function changePsw() {
			  $("#information").addClass("layui-btn-lg");
			  $("#garbNoti").attr("class","layui-btn");
			  $("#garbDire").attr("class","layui-btn");
			  $("#garbRecy").attr("class","layui-btn");
			  $("#garbHome").attr("class","layui-btn");
			  $("#contIfra").attr("src","pswAlter.html");
		  }
	  </script>

	  <style>
		  body {
			  background: url("img/NY.jpg") no-repeat top fixed;
			  background-size: 100%;
			  background-size: cover;
		  }
		  footer{
			  background: url("img/NY.jpg") no-repeat top fixed;
			  background-size: 100%;
			  background-size: cover;
		  }
	  </style>
  </head>
  <body>
	  <!-- 顶部标签开始-->
	<header>
		<section class='header'>
			<section class="header_left">
				<div><a href="userIndex.html"><span>环绿回收</span></a></div>
				<div>
					<span><img src="img/logo.png"/></span>
					<a id="detail" href="" onclick="return false;">
						<span>项目简介</span>
					</a>
					<div id="project_intro">
						<span class="iconfont icon-lingxing"></span>
						<ul>
							<li>
								<a href=""><h3><img src="img/recycle-icon.png">垃圾回收模块：</h3><p>可查看入库垃圾的一些信息，如垃圾类型、数量；是否出库、来源和入库时间；可编辑和删除在库垃圾；提供精确定位搜索垃</p></a>
							</li>
							<li>
								<a href=""><h3><img src="img/direction-icon.png">垃圾去向模块：</h3><p>查看入库垃圾的去向信息，如垃圾数量、是否出库、出库目的地和出库时间；可精确查找运输信息；可以申请运输垃圾列表</p></a>
							</li>
							<li>
								<a href=""><h3><img src="img/idcard-icon.png">员工管理模块：</h3><p>用户的个人信息界面；可更改个人信息；可以更改个人头像</p></a>
							</li>
							<li>
								<a href=""><h3><img src="img/notif-icon.png">公告管理模块：</h3><p>可查看管理官方公告和一些重要信息</p></a>
							</li>
						</ul>
					</div>
				</div>
			</section>
			<section class="header_right">
				<ul>
					<li><a onclick=changes()><img class="avatar_img"  style="height: 40px;width: 40px;"></a></li>
					<li>欢迎你：<a onclick=changes()><span class="name"></span><img src="./img/idcard-icon.png"></a></li>
					<li><a onclick=changePsw()>修改密码</a></li>
					<li>|</li>
					<li><a href="login.html">退出</a></li>
					<li>|</li>
					<li><a href="userIndex.html" onclick="addFavorite(this.href,'这是用户界面');return false;">收藏本站</a> </li>
				</ul>
			</section>
			<section id="adapt" onclick="addMenu();">
				<img src="img/navigation.png">
			</section>

		</section>
	</header>
	 <!-- 顶部标签结束-->
	 <!-- logo标签开始-->
	 <div id="logo">
		 <ul id="nav">
		 		<li><a onclick=changes()><img class="avatar_img"  style="height: 40px;width: 40px;"></a></li>
		 		<li>欢迎你：<a onclick=changes()><span class="name"></span><img src="./img/idcard-icon.png"></a></li>
		 		<li><a onclick=changePsw()>修改密码</a></li>
		 		<li><a href="login.html">退出</a></li>
		 		<li><a href="userIndex.html" onclick="addFavorite(this.href,'这是用户界面');return false;">收藏本站</a> </li>
		 </ul>
	 </div>
	 <!-- logo标签结束-->
	 <!-- sidebar标签开始-->
	 <!-- <div id='sidebar'>
	 </div> -->
	 <!-- sidebar标签结束-->
	 <!-- content开始-->
	 <section id="content">
		 <section class="content_modules">
			 <button type="button" id="garbHome" class="layui-btn layui-btn-lg">
				 <img src="./img/homePage-icon.png" alt="findNoImage">
				 用户首页
			 </button>
			 <button type="button" id="information" class="layui-btn ">
				 <img src="./img/info-icon.png" alt="findNoImage">
				 个人信息
			 </button>
				<button type="button" id="garbRecy" class="layui-btn ">
			 	<img src="./img/recycle-icon.png" alt="findNoImage">
			 	用户订单
			 	</button>
			 	<button type="button" id="garbDire" class="layui-btn ">
			 	<img src="./img/direction-icon.png" alt="findNoImage">
			 	积分商城
			 	</button>
			 	<button type="button" id="garbNoti" class="layui-btn ">
			 	<img src="./img/notif-icon.png" alt="findNoImage">
			 	系统公告
			 	</button>

		</section>
		 <section class="content">
			<iframe id="contIfra" src="userHome.html" scrolling="auto"></iframe>
		 </section>
	 </section>
	 <!-- content结束-->
    <script src="layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript">
      layui.use(['form', 'layedit', 'laydate','layer'], function(){
        var form = layui.form
                ,layer = layui.layer
                ,layedit = layui.layedit
                ,laydate = layui.laydate
				,layer=layui.layer;



      });
    </script>
  </body>
</html>
